<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>熊猫优选 - 免费领淘宝优惠券，买到更便宜</title>
  <link rel="stylesheet" href="../css/list.css">
  <!-- <link rel="stylesheet" href="../lib/swiper/swiper-bundle.min.css"> -->
</head>

<body>
  <!-- 头部 -->
  <header>
    <div class="header-wrap">
      <div class="back-index" id="back-index">
        <a href="#" title="返回主页">
          <span class="logo">
            <img src="../static/image/logo.png" alt="返回主页">
          </span>
          <span>
            <img src="../static/image/logo-word.png" alt="">
          </span>
        </a>
      </div>

      <div class="search">
        <div class="s-wrap">
          <span class="iconfont icon-sousuo"></span>
          <input type="text" placeholder="搜索商品，发现更多优惠">
          <a class="search-btn" id="search-btn">搜索</a>
          <ul class="s-history" id="s-history">
            <li>记录1</li>
            <li>记录2</li>
            <li>记录3</li>
            <li>记录4</li>
          </ul>
        </div>
      </div>

      <ul class="tips">
        <li>
          <img src="../static/image/tips1.png" alt="">
          <span>全程包邮</span>
        </li>
        <li>
          <img src="../static/image/tips2.png" alt="">
          <span>7天退换</span>
        </li>
        <li>
          <img src="../static/image/tips3.png" alt="">
          <span>品质保证</span>
        </li>
      </ul>
    </div>

  </header>
  <!-- 导航区域 -->
  <div class="nav">
    <div class="nav-wrap">
      <ul>
        <li class="active">首页</li>
        <li>9块9包邮</li>
        <li>超值大额卷</li>
        <li>夏季女装上新</li>
      </ul>
    </div>
  </div>

  <div class="content-container">
    <div class="content-wrap">
      <!-- 网页内容上区域 -->
      <div class="content-top">
        <!-- 商品信息显示 -->
        <div class="shop-show">
          <!-- 商品轮播区 -->
          <div class="shop-pic">
            <div class="pic-wrap">
        
            </div>
            <!-- 遮罩层 -->
            <div class="mask"></div>
            <!-- 分页器 -->
            <ul class="pagination"></ul>

          </div>

          <!-- 发大镜区域 -->
          <div class="zoom">
            <img src="../static/image/z1.png" alt="">
          </div>

          <!-- 商品信息区域 -->
          <div class="shop-msg">
            <!-- <h1 class="shop-title">
              <div class="title-icon">
                <img src="../static/image/t-icon1.png" alt="">
                <img src="../static/image/t-icon2.png" alt="">
              </div>
              缤肌深海盐小苏打护龈亮白牙膏去黄牙垢烟渍牙渍口臭口气清新男女
            </h1>

            <div class="shop-price">
              <p class="original-price">
                <i>原价￥49.9</i>
              </p>

              <div class="current-price">
                <span>券后价:</span>
                <span class="price"><i>￥</i>9<span class="digit">.9</span>
                </span>

                <span class="coupon-info">40元劵</span>
                <span class="sale-num">3888人已买</span>
              </div>
            </div>

            <div class="last-tips">
              <p class="expire-date">
                <span>优惠有效期：2021-09-08</span>
              </p>
              <button class="gobuy-btn">领券购买</button>
            </div> -->
          </div>
        </div>

        <!-- 卖家信息 -->
        <div class="seller-info">
          <div class="seller-title">
            <span></span>
            <h5>卖家信息</h5>
            <span></span>
          </div>

          <div class="store-msg">
            <!-- <div class="store-name">
              <img src="../static/image/store.png" alt="">
              <h3>牙齿白旗舰店</h3>
            </div>

            <ul class="sotre-status">
              <li>
                <span>描述</span>
                <i>4.8</i>
              </li>
              <li>
                <span>服务</span>
                <i>4.8</i>
              </li>
              <li>
                <span>物流</span>
                <i>4.8</i>
              </li>
            </ul> -->
          </div>

        </div>
      </div>

      <div class="product-details">
        <div class="imgs">

        </div>
      </div>
    </div>
  </div>


  <script src="../lib/jQuery/jquery-3.6.0.min.js"></script>
  <script src="../lib/swiper/swiper-bundle.min.js"></script>
  <script src="../js/list.js"></script>
 
</body>

</html>